<link rel="stylesheet" href="__PUBLIC__/admin/css/bootstrap.css">
<style type="text/css">
    element.style {
        display: block;
        padding-right: 17px;
    }
    .modal-open .modal {
        overflow-x: hidden;
        overflow-y: auto;
    }
    .modal {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1050;
        display: none;
        outline: 0;
    }
</style>
<div class="content"> 
                <div class="operation">
                    <div class="pull-left">
                        <!-- <button class="add"><span class="glyphicon glyphicon-plus"></span>添加</button> -->
                        <button data-toggle="modal" data-target=".bs-example-modal-lg"><span class="glyphicon glyphicon-plus"></span>添加</button>
                        <!-- <button><span class="glyphicon glyphicon-trash"></span>删除</button> -->
                    </div>
                    <div class="right-box">
                        <input type="search" placeholder="代理商名/公司名搜索..." name="search" class="search" value="{$search}">
                        <span class="glyphicon glyphicon-search" id="sub"></span>
                    </div>
                </div>
                <table class="table">
                    <tbody>
                    <tr>
                        <volist name="header" id="vo">
                            <th>{$vo}
                                <span>
                                    <a class="glyphicon glyphicon-triangle-top"></a>
                                    <a class="glyphicon glyphicon-triangle-bottom"></a>
                                </span>
                            </th>
                        </volist>
                        <th>操作
                            <span>
                                <a class="glyphicon glyphicon-triangle-top"></a>
                                <a class="glyphicon glyphicon-triangle-bottom"></a>
                            </span>
                        </th>
                    </tr>
                        <volist name="list" id="vo">
                        <tr>
                            <volist name="vo" id="v">
                                <td>{$v}</td>
                            </volist>
                            <td>
                                <!-- <a class="glyphicon glyphicon-pencil" data-target=".bs-example-modal-lg" href="{:U('Admin/agent/handle',array('act'=>'edit','admin_id'=>$vo['admin_id']))}"></a> -->
                                <a class="glyphicon glyphicon-pencil add" admin_id="{$vo['admin_id']}"></a>
                                <a class="glyphicon glyphicon-trash" href="{:U('Admin/agent/handle',array('act'=>'del','admin_id'=>$vo['admin_id']))}"></a>
                            </td>
                        </tr>
                        </volist>       
                </tbody>
            </table>
                <div class="page">
                    <span>共 {$count} 条</span>
                    <!-- <select name="" id="">
                        <option value="10">10</option>
                        <option value="20">20</option>
                        <option value="30">30</option>
                        <option value="40">40</option>
                    </select>条 -->
                    <div class="paging">
                        {$page}
                    </div>
                    前往<input type="text" value="{$p}" name='page' onchange="mychange()">页
                </div>    
            </div>
                 <div class="modal fade bs-example-modal-lg">    
                <div class="modal-dialog modal-lg">
                     <form action="{:U('Admin/Agent/handle')}" method="post" enctype="multipart/form-data">
                    <div class="modal-content">
                        <ul class="modal-list">
                            <input type="hidden" name="act" value="add">
                            <input type="hidden" name="admin_id">
                            <li class="row">
                                <label class="col-sm-3">用户名：</label>
                                <div class="col-sm-9">
                                    <input type="text" placeholder="请输入用户名" name="user_name">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">初始密码：</label>
                                <div class="col-sm-9">
                                    <input type="password" placeholder="请输入初始密码" name="password">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">网站域名：</label>
                                <div class="col-sm-9">
                                    <input type="text" placeholder="请输入网站域名" name="websites">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">公司名称：</label>
                                <div class="col-sm-9">
                                    <input type="text"  placeholder="请输入公司名称" name="company_name">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">Logo：</label>
                                <div class="col-sm-9 ">
                                    <div class="filebox">
                                        <div class="file-box" id="fileone">
                                            <input type="file"  class="filePath" name="logo" onchange="filechange(event)" id="file">
                                            上传Logo：
                                        </div>
                                        <img src="#" id="img2" style="display: none"/>
                                    </div>
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">ICO图标：</label>
                                <div class="col-sm-9 ">
                                    <div class="filebox">
                                        <div class="file-box" id="filetwo">
                                            <input type="file"  class="filePath"  name="ico" onchange="filechanges(event)" id="file2">
                                            上传ICO
                                        </div>
                                        <img src="#" id="img4" style="display: none"/>
                                    </div>
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">电话：</label>
                                <div class="col-sm-9">
                                    <input type="text"  placeholder="请输入手机号码" name="phone">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">QQ：</label>
                                <div class="col-sm-9">
                                    <input type="text"  placeholder="请输入QQ号" name="qq">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">邮箱：</label>
                                <div class="col-sm-9">
                                    <input type="email"  placeholder="请输入邮箱" name="email">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">ICP:</label>
                                <div class="col-sm-9">
                                    <input type="tel"  placeholder="请输入ICP" name="icp">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3">地址：</label>
                                <div class="col-sm-9">
                                    <input type="text"  placeholder="请输入地址" name="address">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3"></label>
                                <div class="col-sm-9 ">
                                    <div class="checkbox">
                                        <input name="permissions[]" type="checkbox" value="1" />官网推(SEO)
                                        <input name="permissions[]" type="checkbox" value="1" />软文推
                                        <input name="permissions[]" type="checkbox" value="1" />百度问答
                                    </div>
                                </div>
                            </li>
                            <!-- <li class="row" id="btns" style="display: none"> -->
                            <li class="row" id="btns" style="display: none">
                                <label class="col-sm-3">登录地址:</label>
                                <div class="col-sm-9" style="float: right;" id="url">
                                </div>
                            </li>
                            <li class="row">
                                <label class="col-sm-3"></label>
                                <div class="col-sm-9 ">
                                    <button type="submit" value="Submit">提交</button>
                                </div>
                            </li>
                        </ul>
                    </div>
                    </form>
                </div>               
            </div>
<script type="text/javascript">
    $("#sub").click(function(){
        var search = $('.search').val();
        window.location.href = "/Admin/Agent/index.html?search="+search;
    });

    function mychange(){
      var page =  $('input[name="page"]').val();
      window.location.href = "/index.php/Admin/Agent/index/p/"+page;
    }

    document.onclick = function(e) {
        var modal = 　$('.modal').css('display');
        // console.log(modal);
        if(modal == 'block'){
            $('.modal').css('display','none');
            $(".modal").removeClass("show");
            $("body").removeClass("modal-open");
            $("body").css("padding-right",'0');
            $('#btns').css('display','none');
            $(".modal-backdrop").remove();
        }　　　　　
    }


    $(".add").click(function(){

        var admin_id = $(this).attr('admin_id');
        $.ajax({
            url:'/Admin/Agent/edit',    //请求的url地址
            dataType: "JSON",   //返回格式为json
            async: true,//请求是否异步，默认为异步，这也是ajax重要特性
            type: "post",   //请求方式
            data:{
                admin_id:admin_id,
            },

            success: function (data) {
                if(data.state==1){
                    // console.log(data.data)
                    $.each(data.data, function (i, item) {
                        // console.log(i);
                        $('input[name='+i+']').val(item);
                    });
                    $('#url').html(data.url);
                    $('#url').css('line-height','40px');

                }else{
                    console.log(data.data)
                    return false;
                }
            }
        })

        $("body").addClass("modal-open");
        $(".modal").addClass("show");
        $('.modal').css('display','block');
        $('input[name="act"]').val('edit');
        $('#btns').css('display','block');
        $("body").append("<div class='modal-backdrop fade show'></div>");

    });
    
    $(".modal-content").click(function(event){
        event.stopPropagation();
    });

    $(".add").click(function(event){
        event.stopPropagation();
    });



var filechange=function(event){
    var files = event.target.files, file;
    if (files && files.length > 0) {
        // 获取目前上传的文件
        file = files[0];

        var three=file.name.split(".");
         //获取截取的最后一个字符串，即为后缀名
        var last=three[three.length-1];

        var vidro = last.toLowerCase();
        var URL = window.URL || window.webkitURL;
        // 通过 file 生成目标 url
        var imgURL = URL.createObjectURL(file);

        //用attr将img的src属性改成获得的url
        
        $("#img2").attr("src",imgURL);
        // $("#img2").css("max-width",'400px');
        $("#img2").css("max-height",'100px');
        $("#img2").css("display",'block');
        $('#fileone').css("display",'none');
    }
};

var filechanges=function(event){
    var files = event.target.files, file;
    if (files && files.length > 0) {
        // 获取目前上传的文件
        file = files[0];

        var three=file.name.split(".");
         //获取截取的最后一个字符串，即为后缀名
        var last=three[three.length-1];

        var vidro = last.toLowerCase();
        var URL = window.URL || window.webkitURL;
        // 通过 file 生成目标 url
        var imgURL = URL.createObjectURL(file);

        //用attr将img的src属性改成获得的url
        
        $("#img4").attr("src",imgURL);
        // $("#img4").css("max-width",'400px');
        $("#img4").css("max-height",'100px');
        $("#img4").css("display",'block');
        $('#filetwo').css("display",'none');
    }
};
</script>